<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>日志管理</title>
    <link rel="stylesheet" type="text/css" th:href="@{/static/bootstrap/css/bootstrap.min.css}"/>
	<link rel="stylesheet" type="text/css" th:href="@{/static/css/normalize.css}"/>
	<link rel="stylesheet" type="text/css" th:href="@{/static/css/rightCon.css}"/>
	<link rel="stylesheet" type="text/css" th:href="@{/static/css/page.css}"/>
	<link rel="stylesheet" type="text/css" th:href="@{/static/css/thesame.css}"/>
	<link rel="stylesheet" type="text/css" th:href="@{/static/user/css/popUp.css}"/>
    
    <style type="text/css">
        .table_operation span{cursor: pointer}
        .error{color:red}
        /*取消选中效果*/
		div{
	    -moz-user-select:none;/*火狐*/
	    -webkit-user-select:none;/*webkit浏览器*/
	    -ms-user-select:none;/*IE10*/
	    -khtml-user-select:none;/*早期浏览器*/
	      user-select:none;
		}
		.msgs{ opacity: 0.4; }
		.push-ul{ border-bottom:1px solid #ddd; padding:0 30px }
		.push-ul li{ width: 120px; float:left }
		.push-ul li span{ display: inline-block; padding:20px 0 }
		.push-ul li span.current{ border-bottom: 2px solid #2A58AB  }
		span.wyfzrRegion{
			width: 150px;
			display: inline-block;
			border: 1px solid #1677FF;
			border-radius: 5px;
			text-align: center;
			margin: 10px;
			height: 30px;
			line-height: 30px;
			cursor: pointer;
		}
		span.wyfzrRegion.current{
			color: #fff;
			background-color: #1677FF;
		}
		span.wyfzrRegion.noSelect{
			color: #fff;
			background-color: #ccc;
			border: none;
			cursor: default;
		}
    </style>
</head>
<script th:inline="javascript">var basePath = [[${#httpServletRequest.getContextPath()}]];</script>
<body>
<input id="initPage" th:value="${initPage}" type="hidden">
<div class="right-Sidebar-con">
	<article class="mb20px">
	</article>
	<article class="mb20px">
	<div class="pad20px overflow box-shadows bgWhite border-radius5 mb20px">
		<ul class="form-inline account-form">
			<li class="form-group form-inline mr20px">
				<p class="form-group"><label>请选择时间:</label></p>
				<p class="form-group">
					<input id="startDate" style="width: 160px;" type="text" readonly class="form-control" placeholder="开始时间">&nbsp;-
				</p>
				<p class="form-group">
					<input id="endDate" style="width: 160px;" type="text" readonly class="form-control" placeholder="结束时间">
				</p>
			</li>

			<li class="form-group form-inline mr20px">
				<p class="form-group"><label>类型：</label></p>
				<p class="form-group">
					<select id="functionType" class="form-control" style="width: 180px;" onclick="getData(1)">
						<option value="">--类型--</option>
						<option th:value="${type['labelNo']}" th:each="type:${labelList}" th:text="${type['labelName']}"></option>
					</select>
				</p>
			</li>
			<li class="form-group form-inline lh34px ml60px">
				<span class="bgBlue white inline-block border-radius3 pl30px pr30px mr20px" id="queryBtn">查  询</span>
			</li>
		</ul>
	</div>
    <div class="overflow box-shadows bgWhite border-radius5">
        <div class="pad20px overflow">
			<span class="right">共有<em id="totalCount" class="red">120</em>条数据</span>
		</div>
        <div class="table-con">
            <table cellpadding="0" cellspacing="0" width="100%" border="0" class="textCenter" id="main_table">
            	<thead>
                <tr>
                    <th style="width: 8%">账号</th>
                    <th style="width: 12%">类型</th>
                    <th style="width: 45%">备注</th>
                    <th style="width: 10%">状态</th>
                    <th style="width: 15%">操作时间</th>
                </tr>
                </thead>
               <tbody>

               </tbody>
            </table>
            <div class="textRight page-con">
                <ul class="page inline-block" maxshowpageitem="5" pagelistcount="10"  id="page"></ul>
            </div>
        </div>
    </div>
    </article>
</div>

<div id="pop-delete-con-confirm" style="display:none;">
	<div class="popUp" style="padding:30px;">
		<div class="delete-con">
			<ul>
				<li style="font-size: 17px;font-weight: bold;"><img th:src="@{/static/img/tc_icon_xz.png}">是否要删除此数据？</li>
				<li class="f14px mt15px">删除后将无法恢复，请确认是否要删除这条数据</li>
			</ul>
			<div class="btn-con textRight pt15px cursor">
				<div class="inline-block textCenter overflow">
					<p class="confirm-cancel mr20px close-btn">取    消</p>
					<p class="confirm-con">确    定(5)</p>
				</div>
			</div>
		</div>
	</div>
</div> 

<div id="pop-ret-con-fail" style="display:none;">
	<div class="popUp" style="padding:30px;">
		<div class="delete-con">
			<dl class="textCenter">
				<dt><img th:src="@{/static/img/tc_icon_sb.png}"></dt>
				<dd id="pop-ret-con-fail-msg" class="red"></dd>
			</dl>
		</div>
	</div>
</div> 

<div id="pop-ret-con-fail2" style="display:none;">
	<div class="popUp" style="padding:30px;">
		<div class="delete-con">
			<dl class="textCenter">
				<dt><img th:src="@{/static/img/tc_icon_sb.png}"></dt>
				<dd id="pop-ret-con-fail-title2" class="pt20px pb20px f18px fb"></dd>
				<dd id="pop-ret-con-fail-msg2" class="red"></dd>
			</dl>
		</div>
	</div>
</div> 

<div id="pop-ret-con-succ" style="display:none;">
	<div class="popUp"  style="padding:30px;">
		<div class="delete-con">
			<dl class="textCenter">
				<dt><img th:src="@{/static/img/tc_icon_cg.png}"></dt>
				<dd id="pop-ret-con-succ-msg" class="pt20px f18px fb"></dd>
			</dl>
		</div>
	</div>
</div>

<script th:src="${#request.getContextPath()}+'/static/js/jquery-2.1.3.min.js'"></script>
<script th:src="${#request.getContextPath()}+'/static/layer/layer.js'"></script>
<script th:src="${#request.getContextPath()}+'/static/js/page.js'"></script>
<script th:src="${#request.getContextPath()}+'/static/js/date.js'"></script>
<script th:src="${#request.getContextPath()}+'/static/laydate/laydate.js'"></script>
<script th:src="${#request.getContextPath()}+'/static/validation/jquery.validate.js'"></script>
<script>
	var pageSize = 5;
    var currentPage = 1;
    var dataCount = 0;
    $(function(){
        var initPage = $("input#initPage").val();
        if(initPage){
            getData(initPage);
        }else {
            getData(1);
        }
		laydate.render({
			elem: '#startDate'
			,type: 'date'
			,format: 'yyyy-MM-dd' //可任意组合
		});
		laydate.render({
			elem: '#endDate'
			,type: 'date'
			,format: 'yyyy-MM-dd' //可任意组合
		});
    })
    
    //查询按钮
    $("#queryBtn").unbind().click(function(){
    	getData(1);
    })

    //查询操作员列表
    function getData(page){
    	var startDate=$("#startDate").val().replaceAll(/-/g,"");
    	var endDate=$("#endDate").val().replaceAll(/-/g,"");
    	if(!isNull(startDate)&& !isNull(endDate) && startDate>endDate){
    		layer.msg("开始时间不能大于结束时间");
    		return;
		}
    	var functionType=$("#functionType").val();
        $.ajax({
            url:basePath+"/log/getLogListData",
            type:"post",
            dataType:"json",
            data:{"currentPage":page,"pageSize":pageSize,"startDate":startDate,"endDate":endDate,"functionType":functionType},
            success:function (result) {
                var html = "";
                console.log(result.data);
                if(result.code == 200){
                    if(result.data && result.data.records && result.data.records.length > 0){
                        $.each(result.data.records,function (i,v) {
                        	console.log(v)
                        	html += "<tr>";
                        	html += "<td style='width: 8%'>"+v.user_no+"</td>";
                            html += "<td style='width: 12%'>"+v.function_type+"</td>";
                            html += "<td style='width: 45%'>"+v.remark+"</td>";
                            if(v.state==1){
								html += "<td style='width: 10%'><font style='color:green'>成功</font></td>";
							}else{
								html += "<td style='width: 10%'><font style='color:red'>失败</font></td>";
							}
                            html += "<td style='width: 15%'>"+formatTime(v.create_time)+"</td>";
                            html += "</tr>";
                        })
                        $("#page").initPage(result.data.total,result.data.current,result.data.pages,getData,result.data.size);
						$("#page").show();
                        currentPage = result.data.current;
                        dataCount = result.data.records.length;
                    }else{
                        html += "<tr><td colspan='7'>暂无日志信息！</td></tr>";
						$("#page").hide();
                    }
                }else{
                    html += "<tr><td colspan='7'>获取日志列表失败！</td></tr>";
					$("#page").hide();
                }
                $("table#main_table tbody").html(html);
                $("#totalCount").html(result.data.total)
            }
        })
    }

    function getNotNull(val) {
        val = val + "";
        if($.trim(val) && "null" != val){
            return val;
        }else{
            return "";
        }
    }
    
    function isNull(value) {
        return value == null || value === "" || value === undefined;
    }  
    
   
    
    /**
     * 提示失败
     */
    function retFailPop(msg){
    	$("#pop-ret-con-fail-msg").html(msg);
    	//$("#pop-ret-con-fail-msg").html(msg);
    	layer.closeAll();
    	layer.open({
            type: 1  
            ,title: false //不显示标题栏
            ,closeBtn: false
            ,area: ['25%', '']
            ,shade: 0.8
            ,id: 'deleteFailPop' //设定一个id，防止重复弹出
            ,btnAlign: 'c'
            ,moveType: 1 //拖拽模式，0或者1
            ,shadeClose: true //设置允许点遮罩关闭
            ,content: $("#pop-ret-con-fail").html(),
            success:function(){
            },
            
        });
      }
    
    /**
     * 提示失败，显示具体原因
     */
    function retFailPop2(title, msg){
    	$("#pop-ret-con-fail-title2").html(title);
    	$("#pop-ret-con-fail-msg2").html(msg);
    	layer.closeAll();
    	layer.open({
            type: 1  
            ,title: false //不显示标题栏
            ,closeBtn: false
            ,area: ['25%', '']
            ,shade: 0.8
            ,id: 'deleteFailPop2' //设定一个id，防止重复弹出
            ,btnAlign: 'c'
            ,moveType: 1 //拖拽模式，0或者1
            ,shadeClose: true //设置允许点遮罩关闭
            ,content: $("#pop-ret-con-fail2").html(),
            success:function(){
            },
            
        });
      }
      
    /**
     * 提示成功
     */
    function retSuccPop(msg){
    	$("#pop-ret-con-succ-msg").html(msg);
    	layer.closeAll();
    	layer.open({
            type: 1  
            ,title: false //不显示标题栏
            ,closeBtn: false
            ,area: ['25%', '']
            ,shade: 0.8
            ,id: 'deleteSuccPop' //设定一个id，防止重复弹出
            ,btnAlign: 'c'
            ,moveType: 1 //拖拽模式，0或者1
            ,shadeClose: true //设置允许点遮罩关闭
            ,content: $("#pop-ret-con-succ").html(),
            success:function(){
            },
            
        });
      }
    

</script>
</body>
</html>
